<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/themes/bootstrap/easyui.css"/>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/themes/icon.css"/>

<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/easyui-lang-zh_CN.js"></script>

<title>用户管理（配送点）</title>
</head>
<script type="text/javascript">
	$(function(){
  
		//验证配置
		$.extend($.fn.validatebox.defaults.rules, {
			//验证数字，不限
			number : {
				validator : function(value) {
					var reg = /^[0-9]*$/;
					return reg.test(value);
				},
				message : '请输入数字'
			},
			//验证数字,年龄
			age : {
				validator : function(value) {
					var reg = /^([2-5]\d)|6[0-5]$/;
					return reg.test(value);
				},
				message : '请正确输入年龄'
			},
			//验证数字,电话号码
			phone : {
				validator : function(value) {
					var reg = /^(0?1[358]\d{9})$|^((0(10|2[1-3]|[3-9]\d{2}))?[1-9]\d{6,7})$/ ;
					return reg.test(value);
				},
				message : '请正确输入手机号或电话号码'
			},
			//图片文件名后缀 
			image : {
				validator : function(value) {
					var reg = /[.png|.jpg]$/;
					return reg.test(value);
				},
				message : '请选择正确的文件'
			},
			//excel文件名后缀  
			CHS : {
				validator : function(value) {
					return /.xls$/.test(value);
				},
				message : '请选择正确的文件，文件后缀.xls'
			},
			//验证汉字  
			china : {
				validator : function(value) {
					return /^[\u0391-\uFFE5]+$/.test(value);
				},
				message : '请输入汉字'
			},
		})
		//员工信息数据表格配置
		$('#usercontrol').datagrid({    
		    url:'showStaff',    
		    columns:[[    
		        {field:'dpid',title:'配送点员工编号',hidden : true},    
		        {field:'dpname',title:'姓名',width:200},    
		        {field:'dpage',title:'年龄',width:200,align:'right'},   
		        {field:'dpphone',title:'电话号码',width:200,align:'right'}    
		    ]],
		    pagination : true,
		    toolbar : [
						{
							iconCls : 'icon-add',
							text : '新增',
							handler : function() {
								$("#newly_increasedstaff").dialog('open');
							}
						},'-',{
							iconCls : 'icon-add',
							text : '删除',
							handler : function() {
								$.messager.alert('删除','这是删除按钮');
							}
						},'-',{
							iconCls : 'icon-add',
							text : '修改',
							handler : function() {
								$.messager.alert('修改','这是修改按钮');
							}
						}],
						striped : true,
						rownumbers : true
		}); 
		//默认新增表单是关闭的
		$("#newly_increasedstaff").dialog('close');
		
		//新增表单的提交
		$("#addstaff").form({
    		url:'${pageContext.request.contextPath}/insertStaff',
    		success:function(data){
        		alert(111);
    		}
		});
	})
	
	//点击取消按钮，关闭新增表单，并清空
	function quxiaoaddForm(){
		$("addstaff").form('reset');
		$("#newly_increasedstaff").dialog('close');
	}
	//配置更新表单提交事件
	function addForm(){
		$("addstaff").form('submit');
	}
</script>
<body>
	<table id="usercontrol"></table>
	<!-- 新增的提交表单 -->
	<div id="newly_increasedstaff" class="easyui-dialog" title="修改菜品信息"
		style="width: 300px; height: 360px;"
		data-options="modal:true,draggable:false">
		<form id="addstaff" method="post">
			<div style="margin-bottom: 20px">
				<span>员工姓名</span>
				 <input name="LMdistributionPerson.dpname" type="text" class="easyui-textbox" style="width: 100%" data-options="required:'true',validType:'china'"/> 
			</div>
			<div style="margin-bottom: 20px">
				<span>员工年龄</span>
				 <input name="LMdistributionPerson.dpage" type="text" class="easyui-textbox" style="width: 100%" data-options="required:'true',validType:'age'"/> 
			</div>
			<div style="margin-bottom: 20px">
				<span>员工电话号码</span>
				 <input name="LMdistributionPerson.dpphone" type="text" class="easyui-textbox" style="width: 100%" data-options="required:'true',validType:'phone'"/>
			</div>
		</form>
		<div style="text-align: center; padding: 5px 0">
			<a href="javascript:void(0)" class="easyui-linkbutton"
				onclick="addForm()" style="width: 80px">提交</a>
		</div>
		<div style="text-align: center; padding: 5px 0">
			<a href="javascript:void(0)" class="easyui-linkbutton"
				onclick="quxiaoaddForm()" style="width: 80px">取消</a>
		</div>
	</div>
</body>
</html>